<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>员工列表</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../../js/layui/css/layui.css" media="all">
    <style type="text/css">
        .layui-table-cell{height:40px;line-height:40px;}
    </style>
</head>
<body >
<!--搜索框-->
<!--<div class="layui-form">-->
<!--    <div class="layui-form-item" style="margin-bottom: 30px;text-align: center;">-->
<!--        <div class="layui-inline">-->
<!--            &lt;!&ndash;<label class="layui-form-label">员工姓名或编号</label>&ndash;&gt;-->
<!--            <div class="layui-input-inline">-->
<!--                <input type="text" name="name" placeholder="请输入姓名" autocomplete="off" class="layui-input" />-->
<!--            </div>-->
<!--        </div>-->
<!--        <div class="layui-inline">-->
<!--            <button class="layui-btn layuiadmin-btn-list" lay-submit lay-filter="search-qiye-submit">-->
<!--                <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>-->
<!--            </button>-->
<!--        </div>-->
<!--    </div>-->
<!--</div>-->

<blockquote class="layui-elem-quote quoteBox mod_default_box">
    <form class="layui-form">
        <div class="layui-inline">
            <label class="layui-form-label" style="width: 50px;">关键字</label>
            <div class="layui-input-inline">
                <input type="text" id="name" name="name" placeholder="编号、姓名、联系方式" autocomplete="off" class="layui-input" />
            </div>
            <button class="layui-btn layuiadmin-btn-list" lay-submit lay-filter="search-qiye-submit">
                <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
            </button>
        </div>

        <div class="layui-inline">
            <label class="layui-form-label" style="width: 40px;">物业</label>
            <div class="layui-input-inline">
                <select name="city" lay-verify="" lay-filter="wuye" id="wuye" lay-search>
                    <option value="">选择物业</option>
                </select>
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label" style="width: 40px;">企业</label>
            <div class="layui-input-inline">
                <select name="city" lay-verify="" lay-filter="qiye" id="qiye" lay-search>
                    <option value="">选择企业</option>
                </select>
            </div>
        </div>

        <div class="layui-inline">
            <label class="layui-form-label">未活动时间</label>
            <div class="layui-input-inline">
                <select name="guoji" lay-verify="" lay-filter="days" id="days" lay-search>
                    <option value="">请选择</option>
                    <option value="oneMonth">1个月内</option>
                    <option value="30">1个月</option>
                    <option value="60">2个月</option>
                    <option value="90">3个月</option>
                    <option value="120">4个月</option>
                    <option value="150">5个月</option>
                    <option value="180">6个月</option>
                    <option value="210">7个月</option>
                    <option value="240">8个月</option>
                    <option value="270">9个月</option>
                    <option value="300">10个月</option>
                    <option value="330">11个月</option>
                    <option value="360">12个月</option>
                    <option value="max">超过12个月</option>
                    <option value="noTrail">从未活动过</option>
                </select>
            </div>
        </div>


    </form>
</blockquote>

<!--数据列表-->
<table class="layui-hide" id="test" lay-filter="qiye-table"></table>
<script type="text/html" id="tb">
    <div class="layui-container" style="margin-left:0px;">
        <a class="layui-btn layui-btn-xs" id="exportExcel">导出Excel</a>
    </div>
</script>

<script src="../../js/layui/layui.js"></script>
<script src="../../js/layui/layui.all.js"></script>
<script src="../../js/token.js"></script>
<script src="../../js/config.js"></script>

<script>
    layui.use(['table','upload'], function() {
        var $ = layui.$;
        var table = layui.table;
        var layer = layui.layer;
        var form = layui.form;

        var qiye = ""
        var wuye = ""
        var name = ""
        var days = "";

        table.render({
            elem: '#test'
            , id: 'staff-table-id'//重载需要
            , url: HOST+'trail/getStaffTrail'
            , title: '员工表'
            ,toolbar: '#tb'
            , cols: [[
                {type: 'numbers',title: '序号'}
                , {field: 'bh',align : 'center',width : 125, title: '员工编号'}
                , {field: 'name', width: 110, align: 'center', title: '姓名'}
                , {field: 'guoji',align : 'center',width : 120, title: '国籍',templet: function (d) {
                        if (d.guoji=="null" || d.guoji==null || d.guoji=="undefined") return "";
                        else return d.guoji;
                    }}
                , {field: 'wyName',align : 'center',width : 125, title: '所属物业' , templet:function(res){
                        if(res.wyName != undefined) {
                            return res.wyName
                        }else{
                            return ""
                        }
                    }}
                , {field: 'qyName',align : 'center',width : 125, title: '所属企业' , templet:function(res){
                        if(res.qyName != undefined) {
                            return res.qyName
                        }else{
                            return ""
                        }
                    }}
                ,{field:'sex',width : 60,align : 'center', title: '性别',templet: function (d) {
                        if (d.sex==0) return "女";
                        else if (d.sex==1) return "男";
                    }
                }
                , {field: 'phone',align : 'center',width : 125,title: '联系方式'}
                , {field: 'address',align : 'center',width : 125,title: '家庭住址'}
                , {field: 'status',align : 'center',width : 125, title: '状态',sort:true,templet: function (d) {
                        if (d.status==0) return "离职";
                        else if (d.status==1) return "在职";
                    }
                }
                , {field: 'last_out_time',align : 'center',width : 160,title: '最后活动时间',templet: function (d) {
                        if (d.last_out_time=="null" || d.last_out_time==null || d.last_out_time=="undefined") return "";
                        else return d.last_out_time;
                    }
                }
                ,{field:'wcmDays',width : 140,align : 'center', title: '未活动天数',templet: function (d) {
                        if (d.wcmDays=="null" || d.wcmDays==null || d.wcmDays=="undefined") return "未活动过";
                        else  return d.wcmDays + "天";
                    }
                }
            ]]
            , page: true
            ,page: {
                curr: layui.data("staff_trail_page").index
            },
            done: (res, curr, count) => {
                layui.data("staff_trail_page", {
                    key: 'index',
                    value: curr
                });
                bindClick();
            }
        });

        $.ajax({
            url:HOST+"qiye/selectqiyes" ,
            success:function(res){
                if(res.code == 200) {
                    for(var i in res.data) {
                        $("#qiye").append("<option value='"+res.data[i].id+"'>"+res.data[i].qyname+"</option>")
                    }
                    form.render()
                }
            }
        })

        $.ajax({
            url:HOST+"wuye/selectwuyestatus" ,
            success:function(res){
                if(res.code == 0) {
                    for(var i in res.data) {
                        $("#wuye").append("<option value='"+res.data[i].id+"'>"+res.data[i].wyname+"</option>")
                    }
                    form.render()
                }
            }
        })


        //搜索操作
        form.on('submit(search-qiye-submit)', function (data) {
            name = data.field.name
            table.reload('staff-table-id', {
                where: {"name": data.field.name , "qiye": qiye , "wuye":wuye, "days": days}
                , page: {
                    curr: 1
                }
            });
            return false;
        });

        form.on('select(days)', function(data){
            days = $("#days").val();
            name = $("#name").val();
            table.reload('staff-table-id', {
                where: {"qiye": qiye , "wuye":wuye , "name":name, "days":days}
                , page: {
                    curr: 1
                }
            });
        });


        form.on('select(qiye)', function(data){
            qiye = data.value;
            name = $("#name").val();
            table.reload('staff-table-id', {
                where: {"qiye": qiye , "wuye":wuye , "name":name, "days":days}
                , page: {
                    curr: 1
                }
            });
        });

        form.on('select(wuye)', function(data){
            wuye = data.value
            qiye = null
            name = $("#name").val();
            $.ajax({
                url:HOST+"qiye/selectqiyes" ,
                data:{wuye:wuye} ,
                success:function(res){
                    if(res.code == 200) {
                        $("#qiye option:gt(0)").remove()
                        for(var i in res.data) {
                            $("#qiye").append("<option value='"+res.data[i].id+"'>"+res.data[i].qyname+"</option>")
                        }
                        form.render()
                    }
                }
            })
            table.reload('staff-table-id', {
                where: {"qiye": qiye , "wuye":wuye , "name":name, "days":days}
                , page: {
                    curr: 1
                }
            });
        });

        function bindClick() {
            $('#exportExcel').on('click',function () {
                var staffName = $("#name").val();
                var wuye = $("#wuye").val();
                var qiye = $("#qiye").val();
                var days =$("#days").val();
                $("#exportExcel").attr('href',HOST+"trail/getStaffTrailByExport?name=" + staffName + "&wuye=" + wuye + "&qiye=" + qiye + "&days=" + days);
            });
        }
    });
</script>

</body>
</html>